<template>
  <div>
    <van-goods-action class="shop-car">
      <van-goods-action-icon icon="chat-o" text="客服" />
      <router-link to="/shopcar">
        <van-goods-action-icon icon="cart-o" text="购物车" :badge="badge"/>
      </router-link>
      <van-goods-action-button type="warning" text="加入购物车" @click="showSku" />
      <van-goods-action-button type="danger" text="立即购买" @click="showSku" />
    </van-goods-action>
  </div>
</template>

<script>
export default {
  data(){
    return{
      goodsList:JSON.parse(localStorage.getItem("goodsList")) || [],
      badge:0
    }
  },
  methods: {
    showSku() {
      this.$emit("showSku");
    },
    getBadge(list){
      let sum = 0
      list.forEach((item)=>{
        sum += item.num
      })
      return sum
    }
  },
  watch:{
    goodsList:{
      handler(newVal){
        this.badge = this.getBadge(newVal)
      },
      immediate:true
    }
  },
  created(){
    this.$eventBus.$on("getGoodsList",(res)=>{
      this.badge = this.getBadge(res)
    })
  }
};
</script>

<style>
</style>
